<template lang="html">
  <div class="">
      <div class="add">
          <el-button type="primary" @click="add">新增行情数据</el-button>
      </div>
      <tableVue :list="list" :state="false" v-loading="pageData.loading" :pagination="true">
          <slot>
            <el-table-column label="操作" align="center">
                <template slot-scope="scope">
                  <el-button
                    size="mini"
                    @click="compile(scope.row)">编辑
                  </el-button>
                  <el-button
                    size="mini"
                    type="danger"
                    class="del"
                    @click="del(scope.row,2)">删除</el-button>
                </template>
            </el-table-column>
          </slot>
      </tableVue>
        <dialogVue title="操作" :dialog="dialog" @close="changeData" :state="false">
          <slot>
            <el-form :model="pageData" ref="ruleForm" label-width="160px" class="demo-ruleForm">
                  <el-form-item label="商品回收价格">
                    <el-input v-model="pageData.productPrice" placeholder="请输入内容"></el-input>
                 </el-form-item>
                 <el-form-item label="行情时间">
                   <el-date-picker
                      v-model="pageData.quotationDate"
                      type="date"
                      placeholder="选择日期">
                    </el-date-picker>
                   <!-- <el-input v-model="pageData.quotationDate" placeholder="请输入内容"></el-input> -->
                </el-form-item>
               <el-form-item id="confirm">
                  <el-button type="primary" v-if="btnState == '1'" @click="addOption('post')">提交</el-button>
                  <el-button type="primary" v-if="btnState == '2'" @click="addOption('put')">更新</el-button>
               </el-form-item>
            </el-form>
          </slot>
        </dialogVue>
  </div>
</template>

<script>
import Data from './marketData.js'
import dialogVue from '@/components/dialog.vue'
import tableVue from '@/components/alltable.vue'
import {
  addMarketData,
  delMarketData,
  getMarketDataList
} from "@/api/product/product";
export default {
  components : {
    tableVue,
    dialogVue
  },
  data () {
    return JSON.parse(JSON.stringify(Data))
  },
  mounted () {
    this.getmarketDataList();
  },
  methods : {
    fmtDate (obj) {
      var date =  new Date(obj);
      var y = 1900+date.getYear();
      var m = "0"+(date.getMonth()+1);
      var d = "0"+date.getDate();
      return y+"-"+m.substring(m.length-2,m.length)+"-"+d.substring(d.length-2,d.length);
    },
    getmarketDataList() {
      getMarketDataList(JSON.parse(this.$route.query.item)).then(res=>{
        if (res.data.code == 'OK') {
          this.list.tbody = res.data.data.map(item=>{
            item.gmtCreate = this.switchTime(item.gmtCreate);
            item.gmtUpdate = this.switchTime(item.gmtUpdate);
            item.quotationDate = this.fmtDate(item.quotationDate);
            return item;
          });
        } else {
            this.$message.error(res.data.message);
        }
      })
    },
    add () {
      this.dialog = true;
      this.btnState = '1';
      this.pageData.quotationId = ''
      this.pageData = {}
    },
    compile (item) {

      this.pageData.productPrice = item.productPrice;
      this.pageData.quotationId = item.quotationId;
      this.pageData.quotationDate = item.quotationDate;

      this.dialog = true;
      this.btnState = '2';
    },
    del (item) {//删除条件
      this.delMessage(()=>{
        delMarketData(item.quotationId).then(res=>{
          if (res.data.code == 'OK') {
            this.$message.success('删除成功');
              this.getmarketDataList();
          } else {
            this.$message.error(res.data.message);
          }
        })
      })
    },
    addOption (method) {
      var data = {
        productId : JSON.parse(this.$route.query.item),
        productPrice : this.pageData.productPrice,
        quotationDate : this.pageData.quotationDate,
        quotationId :  this.pageData.quotationId
      }
      addMarketData(data,method).then(res=>{
        if (res.data.code == 'OK') {
          this.getmarketDataList();
          this.dialog = false;
          if (method == 'post') {
            this.$message.success('新增成功');
          } else {
            this.$message.success('编辑成功');
          }
        } else {
          this.$message.error(res.data.message);
        }
      })
    },
    changeData (data) {
      this.dialog = data;
    }
  }
}
</script>

<style scoped>
#confirm {
  position: absolute;
  bottom: -1px;
  right: 100px;
}
</style>
